import { Tag } from 'antd';
import React from 'react';

import MyTooltip from '@/components/tooltip';
import { t } from '@/locales/i18n';
import { AllFlowValueTypeMap, WorkflowIOValueTypeEnum } from '@/types/workflow/constant';

const ValueTypeLabel = ({
  valueType,
  valueDesc,
}: {
  valueType?: WorkflowIOValueTypeEnum;
  valueDesc?: string;
}) => {
  // 合并两个映射以包含所有类型
  const valueTypeData = valueType ? AllFlowValueTypeMap[valueType] : undefined;
  const label = valueTypeData?.label || '';

  return label ? (
    <MyTooltip title={valueDesc}>
      <Tag className="font-11px ml-2 flex h-6 items-center rounded-sm border border-gray-300 bg-gray-100 px-1 text-gray-500">
        {t(label as any)}
      </Tag>
    </MyTooltip>
  ) : null;
};

export default React.memo(ValueTypeLabel);
